<template>
	<div>
		<div style="border: 1px lawngreen solid;height: 30vm; ">
			<alert></alert>
			<h2 style="text-align: center;">学生成绩管理</h2>

			<div style="display: flex;justify-content: space-between;">
				&nbsp;&nbsp;&nbsp;&nbsp;
				<h3>姓名：{{ $store.state.user.uname }}</h3>
				<h3>角色：{{ doRole }}</h3>
				<div style="width: 50px;height: 70px;">
					<img v-bind:src="$ip + `/api/public/showimg/` + $store.state.user.pic"
						style="width: 100%;height: 100%;" />
				</div>
				<a @click="quit()">退出</a>
			</div>
		</div>
		<div style="display: flex;justify-content: space-between;">

			<div style="width: 100%;border: 2px solid darkblue; height: 500px;">
				<router-view></router-view>
			</div>

		</div>
	</div>
</template>
<script setup>
import alert from "./components/Myalert.vue"
</script>
<script>
export default {
	data() {
		return {
		}
	},
	methods: {
		quit() {
			this.$store.state.user = {
				uname: '',
				role: '',
				pic: '',
				token: ''
			}
			window.localStorage.setItem("token", "退出")
			this.$router.push("/login")
		}
	},
	computed: {
		doRole() {
			let role = this.$store.state.user.role
			if (role == "adm") return "管理员"
			if (role == "tea") return "教师"
			if (role == "stu") return "学生"
			return ''
		}
	},
	mounted() {

		const token = window.localStorage.getItem("token")
		if (!token) {
			this.$router.push("/login")
		}
	}

}
</script>